import { makeDiv } from "../core/utils/utils";
import SkillModules from "../game/skills/get_skill";

export default { 
  editMapSiteNext(item){
    let nextDialog = this.dialogs.showInfo('链接设置', `
      对这条链接所有属性进行操作
    `, 
      ['pos:good:指向:unclose', 'skill:good:技能:unclose', 
        'dialogue:good:对话:unclose',
        // 'good:good:物品', 'task:good:任务',
        'remove:bad:删除链接', 'cancel:bad:取消'
      ]
    )

    nextDialog.pos.add(() => {
      // this.dialogs.showInfo('提示', '已经进入编辑模式，点击地图上的节点即可修改');
      this.htmlElement.querySelector('.tip').innerHTML = '已进入编辑模式，点击节点即可实现链接';
      this.useEditMode((mapClip, mapSite) => {
        item.pos = mapSite.mapPos;
        this.renderView(false);
        this.renderMapSiteNexts();
      })
      // this.createLine(1);
    })

    nextDialog.skill.add(() => {
      let { confirm, cancel } = this.dialogs.showOptionInput('技能需求', {
        inputs: [
          {
            text: '熟练度',
            key: 'level',
            value: item.skill ? item.skill.num : 0
          },
        ],
        active: item.skill ? item.skill.key : false,
        options: Object.keys(SkillModules).map(key => ({
          value: key,
          text: key,
          desc: ''
        })),
        isRemove: true
      })

      confirm.add((inputValue, option) => {
        if(!option) return;
        item.skill = {
          key: option,
          num: inputValue.level
        }
        this.renderMapSiteNexts();
      })

      cancel.add(() => {
        item.skill = null;
        this.renderMapSiteNexts();
      })
    })

    nextDialog.dialogue.add(() => {
      let data = item.dialogue ? item.dialogue.split('-') : null;
      let npcId = data ? data[0] : null;
      let { confirm, cancel } = this.dialogs.showOptionInput('对话', {
        inputs: [
          { 
            text: 'Key',
            key: 'dialogue',
            value: data ? data[1] : ''
          }
        ],
        active: npcId,
        options: this.mapData.npcs.map(item => ({
          value: item.storeId,
          text: item.key,
          desc: ''
        })),
        isRemove: true
      })

      confirm.add((inputValue, option) => {
        if(!option) return;
        item.dialogue = option + '-' + inputValue.dialogue;
        this.renderMapSiteNexts();
      })

      cancel.add(() => {
        item.dialogue = null;
        this.renderMapSiteNexts();
      })
    })

    nextDialog.remove.add(() => {
      this.mapSite.attr.next = this.mapSite.attr.next.filter(data => {
        return data.pos[0] != item.pos[0] || data.pos[1] != item.pos[1];
      });
      this.renderView(false);
      this.renderMapSiteNexts();
    })
  },

  renderMapSiteGoWorld(){
    // 绘制前往下一个世界的按钮
    let goWorld = this.mapSite.attr.goWorld;
    if(goWorld){
      let mapClip = this.getMapClip(goWorld.worldPos);
      if(!mapClip){
        logger.warn(`区域: `, this.mapSite.mapPos, '指向的地图块: ', goWorld.worldPos, '不存在!');
        return;
      }
      let mapSite = this.getMapSite(mapClip, goWorld.mapPos);
      if(!mapSite){
        logger.warn('指向的地图块: ', goWorld.worldPos, '中的区域: ', goWorld.mapPos, '不存在!');
        return;
      }

      this.htmlElement.querySelector('.nextMapClip .worldPos').innerHTML = `${mapClip.worldName}[${goWorld.worldPos}]`;
      this.htmlElement.querySelector('.nextMapClip .mapPos').innerHTML = `${mapSite.key}[${goWorld.mapPos}]`;
    } else {
      this.htmlElement.querySelector('.nextMapClip .worldPos').innerHTML = `无`;
      this.htmlElement.querySelector('.nextMapClip .mapPos').innerHTML = `无`;
    }
  },

  renderMapSiteNexts(){
    let nextSites = this.htmlElement.querySelector('.nextSites');
    let next = this.mapSite.attr.next;
    nextSites.innerHTML = '';

    // 绘制下一步链接
    next && next.forEach(item => {
      let nextDom = makeDiv(nextSites, '', ['next', 'styledButton', 'success'], `
        <p><label>指向:</label> [${item.pos}]</p>
        <p><label>技能:</label> ${item.skill ? item.skill.key + `[${getSkillLevelTitle(item.skill.num)}]` : '无'}</p>
        <p><label>对话:</label> ${item.dialogue || '无'}</p>
      `)

      this.trackClicks(nextDom, () => {
        this.editMapSiteNext(item);
      })
    });
  },
}